<template>
  <div class="moremessagelist_main" v-if="items.length > 0">
    <h1>{{ $t("lang.更早之前") }}</h1>
    <MessageItem
      :items="item"
      v-for="(item, index) in items"
      :key="'newmessageitem_' + index"
    >
      <MessageTemplate :item="item" slot="message"></MessageTemplate>
      <FollowButton
        :item="item"
        slot="handle"
        v-if="item.type === 2"
      ></FollowButton>
    </MessageItem>
  </div>
</template>
<script>
export default {
  name: "MoreMessageListMain",
  props: {
    items: {
      type: Array,
      default() {
        return [];
      },
    },
  },
  components: {
    FollowButton: () =>
      import(
        /* webpackChunkName: "followButton" */ "../../components/common/followButton"
      ),
    MessageTemplate: () =>
      import(
        /* webpackChunkName: "messageTemplate" */ "../../components/message/messageTemplate"
      ),
    MessageItem: () =>
      import(
        /* webpackChunkName: "messageItem" */ "../../components/common/messageItem"
      ),
  },
  data() {
    return {};
  },
};
</script>
<style lang="less">
@base: 23.44rem;
.moremessagelist_main {
  padding: 10 / @base;
  h1 {
    font-size: 14 / @base;
    text-align: left;
    padding: 10 / @base 0;
  }
}
</style>
